import React, { Component } from "react";
import { withRouter } from "react-router-dom";
import "./index.less";

@withRouter
export default class MeetingAgenda extends Component {
  state = {
    info: {
      title: "2023年中田(西南)事业发展峰会",
      title_en: "ZHONGTAN GROUP CAREER DEYELOPMENT SUMMIT",
      activeDate: "6.19-6.20",
      activeAddress: "重庆市洛富特酒店",
      date: "6月19日",
      host: "李娟、许晓晓",
      plans: [
        {
          time: "11:00前",
          content: "抵达酒店",
        },
        {
          time: "11:00-11:15",
          content: "集合走红毯",
        },
        {
          time: "11:50-12:45",
          content: "午餐（12点钟准时开餐）",
        },
        {
          time: "12:45-12:50",
          content: "《我们都是醉梦人》重庆",
        },
        {
          time: "12:50-13:00",
          content: "开场+朗读感恩序言10min",
        },
        {
          time: "13:00-13:30",
          content: "重庆优秀股东分享30min（王鹏东）",
        },
        {
          time: "13:00-13:50",
          content: "成都优秀股东分享20min（秦昊岚）",
        },
        {
          time: "13:00-13:50",
          content: "成都优秀股东分享20min（秦昊岚）",
        },
        {
          time: "13:00-13:50",
          content: "成都优秀股东分享20min（秦吴岚）",
        },
        {
          time: "13:00-13:50",
          content: "成都优秀股东分享20min（秦吴岚）",
        },
        {
          time: "13:00-13:50",
          content: "成都优秀股东分享20min（秦吴岚）",
        },
      ],
    },
  };

  componentDidMount() {
    document.title = "会议流程";
  }

  constructor(props) {
    super(props);
  }

  render() {
    return (
      <div className="meeting-agenda">
        <img className="logo" src="/images/logo.png"></img>
        <div className="title">
          <div className="zh">{this.state.info.title}</div>
          <div className="en">{this.state.info.title_en}</div>
        </div>
        <div className="active">
          <div className="item">
            <img src="/images/time.png"></img>
            <div className="label">活动时间:</div>
            <div className="content">{this.state.info.activeDate}</div>
          </div>
          <div className="item">
            <img src="/images/address.png"></img>
            <div className="label">活动地址:</div>
            <div className="content">{this.state.info.activeAddress}</div>
          </div>
        </div>
        <div className="agenda">
          <div className="label">
            <div className="bj"></div>
            <div className="zh">会议流程</div>
            <div className="py">HUI YI LIU CHENG</div>
          </div>
          <div className="content">
            <div className="border-1"></div>
            <div className="border-2"></div>
            <div className="border-3"></div>
            <div className="border-4"></div>
            <div className="date">{this.state.info.date}</div>
            <div className="host">主持人：{this.state.info.host}</div>

            <div className="plans">
              {this.state.info.plans.map((plan) => (
                <div className="item">
                  <div className="time">{plan.time}</div>
                  <img src="/images/hy.png" />
                  <div className="text">{plan.content}</div>
                </div>
              ))}
            </div>
          </div>
        </div>
      </div>
    );
  }
}
